<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>豆瓣练习</title>
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
    <link rel="stylesheet" href="/css/index2.css">
    <link rel="stylesheet" href="/iconfont/iconfont.css">
<body>
       <div class="header container">
                <a href="#" class="logo">
                   <img src="./img/logo_db.png" alt="">
                </a>
                <div class="ipt">
                  <form>
                    <input type="text" placeholder="电影、书籍、音乐" class="ipt">
                   <button>
                    <i class="iconfont icon-fangdajing"></i>
                   </button>
                  </form>
                </div>
                <ul class="menu">
                    <li><a href="#" class="menu-read"></a></li>
                    <li><a href="#" class="menu-movie"></a></li>
                    <li><a href="#" class="menu-music"></a></li>
                    <li><a href="#" class="menu-group"></a></li>
                    <li><a href="#" class="menu-doupin"></a></li>
                    <li><a href="#" class="menu-city"></a></li>
                    <li><a href="#" class="menu-fm"></a></li>
                    <li><a href="#" class="menu-time"></a></li>
                </ul>
       </div>

        <div class="banner">
            <div class="container">
                <div class="slogan">
                    <span>豆瓣 6.0</span>
                    <div >
                        <button>下载豆瓣App</button>
                        <div class="qrcode">
                            <img src="/img/icon-qr-small.png">
                           <div class="qrcode-img">
                               <img src="/img/qrcode.png" alt="">
                               <p>iOS / Android 扫码直接下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <iframe src="/loginframe2.html" frameborder="0" class="loginarea"></iframe>
            </div>
        </div>

        <!--热点-->
        <div>
            <div class="section">
               <div class="container">
                 <div class="main">
                        <div class="section-title">
                            <h2 class="title">热门话题</h2>
                            <span class="link">
                                <a href="">
                                    去话题广场
                                </a>
                            </span>
                        </div>
                        <div class="hot-main">
                            <ul class="left">
                                <li>
                                    <a href="#">
                                        <img src="/img/cover1.webp">
                                    </a >
                                    <a href="#" class="word">
                                        Loremasdas asdfa sdfasdfasdfasdfasdfa
                                    </a>
                                    <span>76张照片</span>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/img/cover1.webp">
                                    </a >
                                    <a href="#" class="word">
                                        我们仍未知道那天所看见的论文的意义
                                    </a>
                                    <span>76张照片</span>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/img/cover1.webp">
                                    </a >
                                    <a href="#" class="word">
                                        Loremasdas asdfa sdfasdfasdfasdfasdf
                                    </a>
                                    <span>76张照片</span>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/img/cover1.webp">
                                    </a >
                                    <a href="#" class="word">
                                        我们仍未知道那天所看见的论文的意义
                                    </a>
                                    <span>76张照片</span>
                                </li>
                            </ul>
                            <ul class="right">
                                <li>
                                    <a href="#">城市失忆症</a>
                                    <div>泼萝的日记</div>
                                    <p>1. “我回到我的城市，熟悉如眼泪，如静脉，如童年的腮腺炎。” 1930年冬天的曼德...</p>
                                </li>
                                <li><a href="">Lorem ipsum dolor sit.</a></li>
                                <li><a href="">Culpa praesentium hic laboriosam?</a></li>
                                <li><a href="">Aliquid iusto excepturi fugit.</a></li>
                                <li><a href="">Eveniet impedit veritatis vitae.</a></li>
                                <li><a href="">Esse pariatur ipsum dicta?</a></li>
                                <li><a href="">Soluta et autem magnam.</a></li>
                                <li><a href="">Officia qui culpa excepturi.</a></li>
                                <li><a href="">Officiis nihil corporis accusamus?</a></li>
                                <li><a href="">Officia nobis sequi error.</a></li>
                                <li><a href="">Cupiditate eius consequatur harum!</a></li>
                            </ul>
                        </div>
                 </div>

                 <div class="aside-right">
                      <img src="./img/adv1.jpg">
                      <div class="section-title">
                        <h2 class="title">热门内容</h2>
                        <span class="link">
                            <a href="">
                                更多
                            </a>
                        </span>
                      </div>
                     <ul class="hot-list">
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                    <li>
                        <div class="title">
                            <a href="">文学作品中最深刻的孤独描写</a>
                        </div>
                        <div class="desc">
                            <span>379728人浏览</span>
                            <span>新话题</span>
                        </div>
                    </li>
                     </ul>
                </div>
               </div>
            </div>
            <div class="section">
                   <!--豆瓣时间-->
                   <div class="container">
                    <div class="aside-left">
                        <h2 class="title">
                            <a href="#" class="dark-color">豆瓣时间</a>
                        </h2>
                    </div>
                   <div class="main">
                    <div class="section-title">
                        <h2 class="title">热门专栏</h2>
                        <span class="link">
                            <a href="">
                                更多
                            </a>
                        </span>
                    </div>
                    <ul class="item-list">
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/img/cover2.jpg">
                            </a >
                            <a href="#" class="word">
                                好莱坞人像布光课——美恐摄影大师教你立刻出师
                            </a>
                            <span>视频专栏</span>
                        </li>
                    </ul>
                   </div>
                </div>
            </div>
            <!--視頻-->
            <div class="section">
                <div class="container">
                    <div class="aside-left">
                        <h2 class="title">
                            <a href="#" class="dark-color">视频</a>
                        </h2>
                    </div>
                    <div class="main video-main">
                        <div class="section-title">
                                <a >
                                    <h2 class="title">瓣嘴</h2>
                                </a>
                        </div>
                        <ul class="item-list">
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                        </ul>
                        <div class="section-title">
                            <a >
                                <h2 class="title">观影会客厅</h2>
                            </a>
                        </div>
                        <ul class="item-list">
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                           
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                            <li >
                                <a href="#">
                                    <img src="/img/cover3.jpg">
                                </a >
                                <a href="#" class="word">
                                    马伊琍衣品遭围攻吐槽，清奇脑回路解读流行语
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
           <!--电影区域-->
            <div class="section">
                <div class="container movie-area">
                    <div class="aside-left">
                        <a >
                            <h2 class="title">电影</h2>
                        </a>
                        <nav class="left-menu">
                            <ul>
                                <li><a href="">影讯&购票</a></li>
                                <li><a href="" class="new">选电影</a></li>
                                <li><a href="">Eum.</a></li>
                                <li><a href="">Voluptatibus?</a></li>
                                <li><a href="" class="new">Commodi.</a></li>
                                <li><a href="">Facere!</a></li>
                                <li><a href="">Est!</a></li>
                                <li><a href="">Suscipit.</a></li>
                                <li><a href="">A.</a></li>
                                <li><a href="">Libero.</a></li>
                                <li><a href="">Dolore.</a></li>
                            </ul>
                        </nav>
                    </div>
                    
                    <div class="main">
                        <div class="section-title">
                            <h2 class="title">正在热映</h2>
                            <span class="link">
                                <a href="">
                                    更多
                                </a>
                            </span>
                        </div>
                        <ul class="item-list">
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁阿拉丁阿拉丁阿拉丁
                                </a>
                               <div class="star">
                                <span class="bg"></span>
                                <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="/img/cover5.webp">
                                </a >
                                <a href="#" class="words" >
                                    阿拉丁
                                </a>
                               <div class="star">
                                  <span class="bg"></span>
                                  <span class="number">8.9</span>
                               </div>
                               <div class="func">
                                <a href="#" class="link">选座购票</a>
                               </div>
                            </li>
                           
                        </ul>
                    </div>
                    <div class="aside-right">
                        <div class="section-title">
                            <h2 class="title">影片分类</h2>
                            <span class="link">
                                <a href="">
                                    更多
                                </a>
                            </span>
                        </div>
                        <ul class="right-menu-list">
                            <li><a href="">爱情</a></li>
                            <li><a href="">喜剧</a></li>
                            <li><a href="">剧情</a></li>
                            <li><a href="">Lorem.</a></li>
                            <li><a href="">Cumque.</a></li>
                            <li><a href="">Velit.</a></li>
                            <li><a href="">Perspici</a></li>
                            <li><a href="">Eos.</a></li>
                            <li><a href="">Quidem.</a></li>
                            <li><a href="">Assumenda.</a></li>
                            <li><a href="">Soluta.</a></li>
                            <li><a href="">Volupt</a></li>
                            <li><a href="">Alias.</a></li>
                        </ul>
                        <div class="section-title">
                            <h2 class="title">近期热门</h2>
                            <span class="link">
                                <a href="">
                                    更多
                                </a>
                            </span>
                        </div>
                        <ul class="order-movie-list">
                            <li> <a href="">风中有朵雨做的云</a></li>
                            <li> <a href="">飞驰人生</a></li>
                            <li><a href="">Lorem, ipsum dolor.</a></li>
                            <li><a href="">Saepe, repellat pariatur!</a></li>
                            <li><a href="">Voluptate, perferendis enim.</a></li>
                            <li><a href="">Rem, qui officiis!</a></li>
                            <li><a href="">Sit, numquam mollitia.</a></li>
                            <li><a href="">Quisquam, aperiam id.</a></li>
                            <li><a href="">Laboriosam, consectetur cupiditate.</a></li>
                            <li><a href="">Maiores, fugiat vel!</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--小组区域-->
            <div class="section">
                <div class="container group-area">
                    <div class="aside-left">
                        <a >
                            <h2 class="title">小组</h2>
                        </a>
                        <nav class="left-menu">
                            <ul>
                                <li><a href="">精选</a></li>
                            <li><a href="" class="new">文化</a></li>
                            <li><a href="">行摄</a></li>
                            <li><a href="">Voluptatibus?</a></li>
                            <li><a href="" class="new">Commodi.</a></li>
                            <li><a href="">Facere!</a></li>
                            <li><a href="">Est!</a></li>
                            <li><a href="">Suscipit.</a></li>
                            <li><a href="">A.</a></li>
                            <li><a href="">Libero.</a></li>
                            <li><a href="">Dolore.</a></li>
                            </ul>
                        </nav>
                    </div>
                   <div class="main">
                    <div class="section-title">
                        <h2 class="title">热门小组</h2>
                        <span class="link">
                            <a href="">
                                更多
                            </a>
                        </span>
                    </div>
                    <ul class="item-list2 ">
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                        <li>
                            <a class="img">
                              <img src="/img/cover6.webp">
                            </a>
                           <div class="words">
                             <a>帮帮组™加入这个组就有人帮你了！</a>
                             <span>16265 个成员</span>
                            </div>
                            
                        </li>
                    </ul>
                   </div>
                    <div class="aside-right">
                        <div class="section-title">
                            <h2 class="title">小组分类
                            </h2>
                        </div>
                        <div class="group">
                            <div class="group-name">
                                <a href="">兴趣</a>
                            </div>
                            <ul class="right-menu-list">
                                <li><a href="">旅行</a></li>
                                <li><a href="">摄影</a></li>
                                <li><a href="">影视</a></li>
                                <li><a href="">Lorem.</a></li>
                                <li><a href="">Cumque.</a></li>
                                <li><a href="">Velit.</a></li>
                                <li><a href="">Perspic</a></li>
                                <li><a href="">Eos.</a></li>
                                <li><a href="">Quidem.</a></li>
                                <li><a href="">Assumenda.</a></li>
                                <li><a href="">Soluta.</a></li>
                                <li><a href="">Voluptat</a></li>
                                <li><a href="">Alias.</a></li>
                            </ul>
                            <div class="group-name">
                                <a href="">兴趣</a>
                            </div>
                            <ul class="right-menu-list">
                                <li><a href="">旅行</a></li>
                                <li><a href="">摄影</a></li>
                                <li><a href="">影视</a></li>
                                <li><a href="">Lorem.</a></li>
                                <li><a href="">Cumque.</a></li>
                                <li><a href="">Velit.</a></li>
                                <li><a href="">Perspic</a></li>
                                <li><a href="">Eos.</a></li>
                                <li><a href="">Quidem.</a></li>
                                <li><a href="">Assumenda.</a></li>
                                <li><a href="">Soluta.</a></li>
                                <li><a href="">Voluptat</a></li>
                                <li><a href="">Alias.</a></li>
                            </ul>
                            <div class="group-name">
                                <a href="">兴趣</a>
                            </div>
                            <ul class="right-menu-list">
                                <li><a href="">旅行</a></li>
                                <li><a href="">摄影</a></li>
                                <li><a href="">影视</a></li>
                                <li><a href="">Lorem.</a></li>
                                <li><a href="">Cumque.</a></li>
                                <li><a href="">Velit.</a></li>
                                <li><a href="">Perspic</a></li>
                                <li><a href="">Eos.</a></li>
                                <li><a href="">Quidem.</a></li>
                                <li><a href="">Assumenda.</a></li>
                                <li><a href="">Soluta.</a></li>
                                <li><a href="">Voluptat</a></li>
                                <li><a href="">Alias.</a></li>
                            </ul>
                            <div class="group-name">
                                <a href="">兴趣</a>
                            </div>
                            <ul class="right-menu-list">
                                <li><a href="">旅行</a></li>
                                <li><a href="">摄影</a></li>
                                <li><a href="">影视</a></li>
                                <li><a href="">Lorem.</a></li>
                                <li><a href="">Cumque.</a></li>
                                <li><a href="">Velit.</a></li>
                                <li><a href="">Perspic</a></li>
                                <li><a href="">Eos.</a></li>
                                <li><a href="">Quidem.</a></li>
                                <li><a href="">Assumenda.</a></li>
                                <li><a href="">Soluta.</a></li>
                                <li><a href="">Voluptat</a></li>
                                <li><a href="">Alias.</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>

            <!--读书区域-->
            <div class="section">
                <div class="container book-area">
                    <div class="aside-left">
                        <a >
                            <h2 class="title">读书</h2>
                        </a>
                        <nav class="left-menu">
                            <ul>
                                <li><a href="">分类浏览</a></li>
                            <li><a href="" class="new">阅读</a></li>
                            <li><a href="">作者</a></li>
                            <li><a href="">书评</a></li>
                            </ul>
                        </nav>
                        <!--图标-->
                        <div class="icon">
                            <a href="#"></a>
                            <span>豆瓣阅读</span>
                        </div>
                    </div>
                    <div class="main">
                        <div class="section-title">
                            <h2 class="title">新书速递</h2>
                            <span class="link">
                                <a href="">
                                    更多
                                </a>
                            </span>
                        </div>
                        <ul class="item-list">
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                            <li>
                                <a>
                                    <img src="/img/cover7.jpg" alt="">
                                </a>
                                <a href="#" class="words" >
                                   多金时代
                                </a>
                              
                                <span class="number">夏晚晴</span>
                           
                               <div class="func">
                                  <a href="#" class="link">免费试读</a>
                               </div>
                            </li> 
                        </ul>
                    </div>
                    <div class="aside-right">
                        <div class="section-title">
                            <h2 class="title">热门标签</h2>
                            <span class="link">
                                <a href="">
                                    更多
                                </a>
                            </span>
                        </div>
                        <div class="group">
                            <ul class="right-menu-list">
                                <li><span>[文学]</span></li>
                                <li><a href="">小说</a></li>
                                <li><a href="">随笔</a></li>
                                <li><a href="">日本文学</a></li>
                                <li><a href="">Lorem.</a></li>
                                <li><a href="">Cumque.</a></li>
                                <li><a href="">Velit.</a></li>
                                <li><a href="">Perspicia</a></li>
                                <li><a href="">Eos.</a></li>
                                <li><a href="">Quidem.</a></li>
                                <li><a href="">Assumenda.</a></li>
                                <li><a href="">Soluta.</a></li>
                                <li><a href="">Voluptat</a></li>
                                <li><a href="">Alias.</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>

       

     
</body>
</html>